<template>
    <div v-bind="$attrs" :style="$attrs.style as any" :class="$attrs.class as any">
        <el-table class="w-100" :data="$attrs['data']">
            <el-table-column prop="label" label="行为" align="center">
            </el-table-column>
            <el-table-column prop="trigger" label="触发事件" min-width="260px" align="left">
                <template #default="scope">
                    <el-radio-group v-model="scope.row.trigger" @change="onchange($attrs['data'] as any[])">
                        <el-radio-button
                            v-for="item in $data.enums.getItems($data.enums.joinType(scope.row.type, scope.row.value))"
                            :key="item" :label="item.value">
                            {{ item.label }}
                        </el-radio-button>
                        <el-radio-button label="无" value=""></el-radio-button>
                    </el-radio-group>
                </template>
            </el-table-column>
        </el-table>
    </div>
</template>

<script setup lang="ts">
import $data from 'xcore/data';
import { IBindEvent } from 'xcore/cmpnt';

const emit = defineEmits(['change']);

const onchange = (events: any[]) => {
    events.forEach((item) => {
        let data: IBindEvent = {
            event: item.value,
            action: item.trigger,
        };
        emit('change', data);
    });

};
</script>

<style scoped></style>